<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8" />
    <title>资讯</title>
    <link rel="stylesheet" href="css/yueke.css">
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="underscore/underscore-min.js"></script>
    <script type="text/javascript" src="js/list_more.js"></script>
    <script type="text/javascript" src="js/fixation.js"></script>
   <!--  <style type="text/css">
       .fixed_right{
       position:fixed;
       top:0;
       left:50%;
       margin-left:295px;
       _position: absolute;
       _bottom: auto;
       _top: expression(eval(document.documentElement.scrollTop)+0);
       }  
       * html{
       background-image:url(about:blank);
       background-attachment:fixed;
       }
       .fixed_right_2{
           position: absolute; top:4717px;
       }
     </style> -->
</head>
<body class="background_grey">
    <div class="header">
        <div class="header_in">
            <div class="header_logo">
                <h1></h1>
                <img src="images/index_log.jpg" />
            </div>
            <div class="header_nav">
                <ul>
                    <li><a href="model_news_list.html">前沿资讯</a></li>
                    <li><a href="model_problem_list.html">互动问答</a></li>
                    <li><a href="model_personage_center.html">帮助中心</a></li>
                </ul>
            </div>
            <div class="header_info">
                <div class="header_info_find"><a href="#">寻找合作伙伴</a></div>
                <div class="header_register">
                    <a href="#">登录</a>|
                    <a href="#">注册</a>
                </div>
                <div class="header_become">
                    <a href="#">成为我们的专家</a>
                </div>
            </div>
            <div class="clear_both"></div>
        </div>
    </div>
    <div class="index_banner">
        <ul class="index_banner_in" id="index_banner">
            <li class="index_banner_item">
                <div class="index_banner_item_in">
                    <img src="images/index_banner.jpg" alt="" />
                </div>
            </li>
            <li class="index_banner_item">
                <div class="index_banner_item_in">
                    <img src="images/index_banner.jpg" alt="" />
                </div>
            </li>
            <li class="index_banner_item">
                <div class="index_banner_item_in">
                    <img src="" alt="" style="background:#f90;"/>
                </div>
            </li>
            <li class="index_banner_item">
                <div class="index_banner_item_in">
                    <img src="images/index_banner.jpg" alt="" />
                </div>
            </li>
        </ul>
        <ol class="index_banner_circle" id="index_circle">
            <li class="active"></li>
            <li></li>
            <li class="last"></li>
        </ol>
        <div class="index_banner_prev" id="index_prev"></div>
        <div class="index_banner_next" id="index_next"></div>
    </div>
    <div class="news_list">
        <div class="news_list_left">
            <div class="news_list_left_problem_img">
                <ul>
                    <li class="news_list_left_problem_img_item">
                        <img src="images/news_detail_img.jpg" alt="" />
                        <div class="news_list_left_problem_img_font">
                            公司暂时不上市，员工要跑怎么办？硅谷有了新方法
                        </div>
                    </li>
                    <li class="news_list_left_problem_img_item">
                        <img src="images/news_detail_img.jpg" alt="" />
                        <div class="news_list_left_problem_img_font">
                            公司暂时不上市，员工要跑怎么办？硅谷有了新方法
                        </div>
                    </li>
                    <li class="news_list_left_problem_img_item last">
                        <img src="images/news_detail_img.jpg" alt="" />
                        <div class="news_list_left_problem_img_font">
                            公司暂时不上市，员工要跑怎么办？硅谷有了新方法
                        </div>
                    </li>
                </ul>
            </div>
            <div class="news_list_left_problem_list">
                <ul id="problem_list">
                    <li class="news_list_left_problem_item active">
                        <div class="news_list_left_problem_item_left">
                            <img src="images/news_detail_img.jpg" alt="" />
                        </div>
                        <div class="news_list_left_problem_item_right">
                            <div class="news_list_left_problem_item_title">云服务为什么需要配备1对1技术顾问？网易云信这支重金打造的技术顾问团队告诉你</div>
                            <div class="news_list_left_problem_item_info">网易云信全新推出T服务，独创1对1技术顾问实时响应解决每个技术难题，让你不再惧怕上云</div>
                            <div class="news_list_left_problem_item_time">
                                <span class="person">文/<i>Zoe</i> ·2小时前</span>
                                <span class="number">13,240</span>
                                <span class="praise">527</span>
                            </div>
                        </div>
                    </li>
                    <li class="news_list_left_problem_item">
                        <div class="news_list_left_problem_item_left">
                            <img src="images/news_detail_img.jpg" alt="" />
                        </div>
                        <div class="news_list_left_problem_item_right">
                            <div class="news_list_left_problem_item_title">云服务为什么需要配备1对1技术顾问？网易云信这支重金打造的技术顾问团队告诉你</div>
                            <div class="news_list_left_problem_item_info">网易云信全新推出T服务，独创1对1技术顾问实时响应解决每个技术难题，让你不再惧怕上云</div>
                            <div class="news_list_left_problem_item_time">
                                <span class="person">文/<i>Zoe</i> ·2小时前</span>
                                <span class="number">13,240</span>
                                <span class="praise">527</span>
                            </div>
                        </div>
                    </li>
                    <li class="news_list_left_problem_item">
                        <div class="news_list_left_problem_item_left">
                            <img src="images/news_detail_img.jpg" alt="" />
                        </div>
                        <div class="news_list_left_problem_item_right">
                            <div class="news_list_left_problem_item_title">云服务为什么需要配备1对1技术顾问？网易云信这支重金打造的技术顾问团队告诉你</div>
                            <div class="news_list_left_problem_item_info">网易云信全新推出T服务，独创1对1技术顾问实时响应解决每个技术难题，让你不再惧怕上云</div>
                            <div class="news_list_left_problem_item_time">
                                <span class="person">文/<i>Zoe</i> ·2小时前</span>
                                <span class="number">13,240</span>
                                <span class="praise">527</span>
                            </div>
                        </div>
                    </li>
                    <li class="news_list_left_problem_item">
                        <div class="news_list_left_problem_item_left">
                            <img src="images/news_detail_img.jpg" alt="" />
                        </div>
                        <div class="news_list_left_problem_item_right">
                            <div class="news_list_left_problem_item_title">云服务为什么需要配备1对1技术顾问？网易云信这支重金打造的技术顾问团队告诉你</div>
                            <div class="news_list_left_problem_item_info">网易云信全新推出T服务，独创1对1技术顾问实时响应解决每个技术难题，让你不再惧怕上云</div>
                            <div class="news_list_left_problem_item_time">
                                <span class="person">文/<i>Zoe</i> ·2小时前</span>
                                <span class="number">13,240</span>
                                <span class="praise">527</span>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="news_list_left_btn" id="moreBt"><a href="javascript:;">查看更多资讯</a></div>
        </div>
        <div class="news_list_right" id="fixed_right">
            <div class="news_list_right_title">最新资讯</div>
            <ul class="news_list_right_list">
                <li class="news_list_right_item">
                    <div class="news_list_right_item_font"><a href="#">最新资讯最新资讯最新资讯最新资讯最新资讯最新最新资讯 </a></div>
                    <div class="news_list_right_item_num">12460</div>
                </li>
                <li class="news_list_right_item">
                    <div class="news_list_right_item_font"><a href="#">最新资讯最新资讯最新资讯最新资讯最新资讯最新最新资讯 </a></div>
                    <div class="news_list_right_item_num">12460</div>
                </li>
                <li class="news_list_right_item">
                    <div class="news_list_right_item_font"><a href="#">最新资讯最新资讯最新资讯最新资讯最新资讯最新最新资讯 </a></div>
                    <div class="news_list_right_item_num">12460</div>
                </li>
                <li class="news_list_right_item">
                    <div class="news_list_right_item_font"><a href="#">最新资讯最新资讯最新资讯最新资讯最新资讯最新最新资讯 </a></div>
                    <div class="news_list_right_item_num">12460</div>
                </li>
            </ul>
        </div>
    </div>
    <div class="index_link">
        <div class="index_link_in"></div>
    </div>
    <div class="index_footer">
        <div class="index_footer_link">
            <a href="">新闻公告</a>|
            <a href="">关于我们</a>|
            <a href="">联系我们</a>|
            <a href="">用户协议</a>
        </div>
        <p class="index_footer_copy">Copyright©2016 yk-zb.com 粤科众包 版权所有 粤ICP备16027165号-1</p>
    </div>
    <script id="problemItem" type="text/template">
        <li class="news_list_left_problem_item">
            <div class="news_list_left_problem_item_left">
                <img src="<#= url_img #>" alt="" />
            </div>
            <div class="news_list_left_problem_item_right">
                <div class="news_list_left_problem_item_title"><#= title #></div>
                <div class="news_list_left_problem_item_info"><#= detail #></div>
                <div class="news_list_left_problem_item_time">
                    <span class="person"><#= time #></span>
                    <span class="number"><#= read #></span>
                    <span class="praise"><#= like #></span>
                </div>
            </div>
        </li>
    </script>
</body>
</html>
<script type="text/javascript">
    $(function() {
        /*(function onScroll(){
            var otop=$("#fixed_right").offset().top-25;
            $(window).scroll(function () {     
                                     //屏幕滚动事件
                if($(window).scrollTop()<otop){
                 $("#fixed_right").removeClass('fixed_right_2');              //因为ie6兼容固定定位问题，所以都用添加类和删除类
                 $("#fixed_right").removeClass('fixed_right');

                }else if ($(window).scrollTop()>=otop) {
                 $("#fixed_right").removeClass('fixed_right_2');
                 $("#fixed_right").addClass('fixed_right');
                }
            });
        })();*/
        
        (function fnPaging(){
            var pages = 5 ;    //分页总页数
            var page = 1;
            function loadmore() {
                var rnd = parseInt(Math.random()*1000+1);
                          //alert("currentPage=" + page + ",totalePage=" + pages);
                var url=" " + "/" + page;//页面
                var json = {
                    time : '2016-05-23 21:09',
                    url_img : 'images/news_detail_img.jpg',
                    title : '云服务为什么需要配备1对1队告诉你',
                    detail : '网易云信全新推出T服务，独创1对1技术顾问实时响应创1对1技术顾问实时响应创1对1技术顾问实时响应解决每个技术难题，让你不再惧怕上云',
                    time : '文/<i>Zoe</i> ·2小时前',
                    read : '13,240' ,
                    like : '1235'
                }
                // console.log(json)
                var t = _.template($("#problemItem").text());
                var htmlTxt = t(json);
            // console.log(t,htmlTxt)
            $('#problem_list').append(htmlTxt);
                  /*$.ajax({
                        type: "get",
                        url: url,
                        rnd: rnd,
                        dataType: "json",
                        success: function(result) {
                                if(result.code == 1){
                                      var list = result.data.order_list;
                                      //每次都返回总页数
                                      pages = result.data.page_size;
                                      console.log(result.data);
                                      for(var i = 0; i < list.length; i++){
                                            var order_item = list[i];
                                            console.log(order_item);
                                            var t = _.template($("#problemItem").text());
                                            var htmlTxt = t(order_item);

                                            $('#problem_list').append(htmlTxt);
                                      }
                                      if (page >= pages){
                                              $("#moreBt").html('没有更多');
                                      }
                                }else{
                                          UBox.show('加载失败', -1);
                                }
                        }
                  });*/
                };
                $("#moreBt").click(function(event) {
                    if(page >= pages){
                        $("#moreBt").html('没有更多');
                        return false;
                    }else{
                         page++;
                    }
                    loadmore()
                });
        })();
        /*拼装*/
        /*(function fnAssembly(){
            var json = {
                time : '2016-05-23 21:09',
                url_img : 'images/news_detail_img.jpg',
                title : '云服务为什么需要配备1对1队告诉你',
                detail : '网易云信全新推出T服务，独创1对1技术顾问实时响应创1对1技术顾问实时响应创1对1技术顾问实时响应解决每个技术难题，让你不再惧怕上云',
                time : '文/<i>Zoe</i> ·2小时前',
                read : '13,240' ,
                like : '1235'
            }
            // console.log(json)
            var t = _.template($("#problemItem").text());
            var htmlTxt = t(json);
            // console.log(t,htmlTxt)
            $('#problem_list').append(htmlTxt);
        })();*/
        //banner 轮播
        (function fnBanner(){
            var iWinWidth = $(window).width();
            var iNum = $('#index_banner li').length;
            var iCirWidth = $('#index_circle li').width()*iNum + 22*(iNum - 1);
            var indexOld = 0;
            var indexNow = 0;
            var timer = null ;

            $('#index_banner li').css('width',iWinWidth+'px');
            $('#index_circle').css({"width":iCirWidth + "px","margin-left":-iCirWidth/2 + "px"});
            $('#index_banner').css({"width":iWinWidth * iNum + "px"});
            timer = setInterval(autoPlay, 2000)
            function autoPlay(){
                indexOld++;
                indexNow++;
                if(indexOld >= 4){
                    indexOld = 1;
                    indexNow = 1;
                    $('#index_banner').css({"left":0});
                }else if(indexOld == 3){
                    indexNow = 0;
                }
                // console.log(indexOld);
                $('#index_circle li').removeClass('active');
                $('#index_circle li').eq(indexNow).addClass('active');
                $('#index_banner').animate({"left":-iWinWidth * indexOld + "px"}, 200);
            }
            if(iNum <= 1){
                $('#index_circle').hide();
                $('#index_next').hide();
                $('#index_prev').hide();
                clearInterval(timer);
            }else{
                $('.index_banner').mousemove(function(event) {
                    clearInterval(timer);
                }).mouseleave(function(event) {
                    clearInterval(timer);
                    timer = setInterval(autoPlay, 2000);
                });;
            }
            $('#index_next').click(function(event) {
                indexOld++;
                indexNow++;
                if(indexOld >= 3){
                    indexOld = 2;
                    indexNow = 2;
                }
                // console.log(indexOld);
                $('#index_circle li').removeClass('active');
                $('#index_circle li').eq(indexNow).addClass('active');
                $('#index_banner').animate({"left":-iWinWidth * indexOld + "px"}, 200);
            });
            $('#index_prev').click(function(event) {
                if(indexOld == 0){
                    return;
                }
                indexOld--;
                indexNow--;
                // console.log(indexOld);
                $('#index_circle li').removeClass('active');
                $('#index_circle li').eq(indexNow).addClass('active');
                $('#index_banner').animate({"left":-iWinWidth * indexOld + "px"}, 200);
            });
            $('#index_circle li').click(function(event) {
                indexOld = $('#index_circle li').index(this);
                $('#index_circle li').removeClass('active');
                $('#index_circle li').eq(indexOld).addClass('active');
                $('#index_banner').animate({"left":-iWinWidth * indexOld + "px"}, 200);
            });
        })()
        $("#problem_list").on("mousemove",'.news_list_left_problem_item', function(e) {
            $('.news_list_left_problem_item').removeClass('active');
            $(this).addClass('active');
        });
        $('#problem_list')
        $("#problem_list").on("click",'.praise', function(e) {
            var value = parseInt($(this).html());
            if($(this).hasClass('active')){
                /*$.ajax({                
                type: "POST",
                url: '', 
                data: {
                      },
                dataType: "json",
                success: function(data){
                           $(this).removeClass('active');
                           $(this).html(value-1);
                        },
                error: function(data){
                            // UBox.show("提交失败", -1);
                        } 
                }); */
                $(this).removeClass('active');
                $(this).html(value-1);
            }else{
                /*$.ajax({                
                type: "POST",
                url: '', 
                data: {
                      },
                dataType: "json",
                success: function(data){
                        $(this).addClass('active');
                        $(this).html(value+1);
                        },
                error: function(data){
                            // UBox.show("提交失败", -1);
                        } 
                });*/
                $(this).addClass('active');
                $(this).html(value+1);
            };
        });
    });
</script>